<template>
  <div class="wallet">
    <div class="mymould_23" style="margin-bottom: 20px">
      <div class="pl10 pr10">
        <div class="wallet pad10">
          <div class="clearfix title">
            <div class="f1">
              <a>
                <img src="" />
              </a>
            </div>
            <div class="fr">
              <a>
                <img src="" />
              </a>
            </div>
          </div>
          <div class="clearfix mt20" >
            <div class="f1" v-for="(item,index) in imgList" :key="index" @click="alertHandler(item.id)" style="width: 25%">
              <a class="db ftc pl5 pr5" @click="turnHandler(item.id)">
                <div class="liimg rela">
                  <span class="bold ft14 cf0">{{item.above_text}}</span>
                </div>
                <div class="ft12 ftc ell mt5">{{item.below_text}}</div>
              </a>
            </div>
           
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import Vue from 'vue';
import { Dialog } from 'vant';

// 全局注册
Vue.use(Dialog);
export default {
  data() {
    return {
      imgList: [],
    };
  },
  methods:
  {
    alertHandler(id){
     
      if(id==="145") 
      Dialog.alert({
    message: '对不起，网页版暂不支持该功能<br>请下载App体验更多精彩',
    theme: 'round-button',
    confirmButtonColor:'#41c856',
    confirmButtonText:'下载App',
    // lockScroll:'false',
    closeOnClickOverlay:'true'
    }).then(() => {
    code=200
  
});
    },
    turnHandler(id){
      if(id==="79") 
      this.$router.push({
        path:'/Service'
      })
      if(id==="78") 
      this.$router.push({
        path:'/presell'
      })
      if(id==="80") 
      this.$router.push({
        path:'/attention'
      })
      
    }

    },
  

  
  async mounted() {
    
    let result = await this.$http.get({
      url: "/user/UserCenter.html",
      params: {
        version: '420',
        system: 'wap',
        isWeb: 1,
        distinct_id:
          '96513866273889',
        debug_param:''
      }
    })
    this.imgList = result.list[2].data.items;
  }
}
</script>
<style lang="stylus" scoped>
a 
  color: #333;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
.block, .db 
  display: block;
.rela 
  position: relative;
.fr 
  float: right;
.clearfix:after 
  content: ' ';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
.ftc 
  text-align: center;
a img 
  border: 0;
img 
  vertical-align: middle;
.f1 
  float: left;
.pl10 
  padding-left: 0.1rem;
.pr10 
  padding-right: 0.1rem;
.mt20 
  margin-top: 0.2rem;
.el2, .ell 
  overflow: hidden;
.ell 
  text-overflow: ellipsis;
  white-space: nowrap;
.ft12 
  font-size: 0.12rem;
.mt5 
  margin-top: 0.05rem;
.wallet 
  -webkit-box-shadow: 0.01rem 0.02rem 0.25rem 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0.01rem 0.02rem 0.25rem 0px rgba(0, 0, 0, 0.1);
  border-radius: 0.15rem;
.pad10 
  padding: 0.1rem;
.pl5 
  padding-left: 0.05rem;
.pr5 
  padding-right: 0.05rem;
.cf0 
  color: #ff5757;
.ft14 
  font-size: 0.14rem;
.bold 
  font-weight: 700;
.wallet .title img 
  height: 0.16rem;
</style>